<template>
  <div>
    <div>坐标</div>
    <div>x: {{x}}</div>
    <div>y: {{y}}</div>
    <hr>
    <div>{{count}} <button @click="add">累加1</button></div>
  </div>
</template>

<script>
const useMouse = () => {
   // 1. 记录鼠标坐标
    // 1.1 定义一个响应式数据对象，包含x和y属性。
    const mouse = reactive({
      x: 0,
      y: 0
    })
    // 1.3 修改响应式数据
    const move = (e) => {
      mouse.x = e.pageX
      mouse.y = e.pageY
    }
    return mouse
};

export default {
  name: "app",
  setup() {
    // return { onmousemove };
  },
};
</script>
